{extend name="base"}
{block name="title"}
点赚金-后台管理-商品管理
{/block}
{block name="pageName"}
未审核商品列表
{/block}
{block name="css"}
	<style>
		.table th, .table td {
			text-align: center;
			vertical-align: middle!important;
		}
		#img_picture li,#Pics{
			display:inline-block;
			float:left;
		}
	</style>
	<script>
		function cleanPicInput(){
			$("#commodity_picture").val("");
			$("#img_picture").html("");
		}
	</script>
{/block}
{block name="pageBody"}
<!-- 一个表格 -->
<div class="btn-toolbar">
    <button class="btn btn-primary" data-title="Add Commodity" data-toggle="modal" data-target="#add_commodity" onclick="cleanPicInput()"><i class="icon-plus"></i>发布商品</button>
    <button class="btn btn-success" onclick="javascript:location.reload()">刷新</button>
  <div class="btn-group">
  </div>
</div>
<div class="well">
    <table class="table table-bordered" >
			<thead>
				<tr>
					<th>#</th>
					<th>商品名称</th>
					<th>商品图片</th>
					<th>分类</th>
					<th>商品价格</th>
					<th>发布时间</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody id="commoditys">
				{volist name='commoditys' id='commodity'}
				<tr id="{$commodity.commodity_id}">
					<th scope="row">{$i}</th>
					<td>{$commodity.commodity_name}</td>
					<td><img onclick="getPics('{$commodity.commodity_id}')" style="height: 150px" src="{$commodity.picture_address}"></td>
					<td>{$commodity.category_name}</td>
					<td>{$commodity.commodity_price} 元</td>
					<td>{$commodity.gmt_create}</td>
					<td>
						<div class="dropdown">
							<button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="false">操作<span class="caret"></span></button>
							<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 38px, 0px); top: 0px; left: 0px; will-change: transform;">
								<li><a onclick="check('{$commodity.commodity_id}')">通过</a></li>
								<li><a onclick="remove('{$commodity.commodity_id}')">不通过</a></li>
							</ul>
						</div>
					</td>
				</tr>
				{/volist}	
			</tbody>
		</table>
</div>
<div class="pagination">
    {$commoditys->render()}
</div>

<script>
	function check(commodity_id){
		if(confirm("确认审核通过？")){
			$.getJSON("{:url('checkCommodity')}",{commodity_id:commodity_id},function(data){
				if(0 == data.code){
					$("#"+data.data).remove();
					alert("商品编号:"+data.data+"审核成功");
				}else{
					alert("审核失败");
				}
				
			});
		}
	}

	function remove(commodity_id){
		if(confirm("确认审核不通过？")){
			$.getJSON("{:url('removeCommodity')}",{commodity_id:commodity_id},function(data){
				if(0 == data.code){
					$("#"+data.data).remove();
					alert("商品编号:"+data.data+"撤销成功");
				}else{
					alert("撤销失败");
				}
				
			});
		}
	}

	function getPics(commodity_id){
		$.getJSON("{:url('getCommodityPic')}",{commodity_id:commodity_id},function(data){
			$("#Pics").html("");
			if(0 == data.code){
				var pictures = data.data;
				for(var i=0;i<pictures.length;i++){
					$("#Pics").append("<li><img style='width:100px' src='"+pictures[i].picture_address+"'></li>");
				}
				$('#show_pic').modal('show');
			}else{
				alert("获取图片失败");
			}
		});
	}
</script>
{/block}

{block name="model"}
	<script>
		function addCommodity(){
			var form = new FormData(document.getElementById("addCommodity"));
			$.ajax({
                url:"{:url('addCommodity')}",
                type:"post",
                data:form,
                processData: false,                // jQuery不要去处理发送的数据
    			contentType: false,
    			dataType: 'json',
                success:function(data){
                    if (0 == data.code) {
                    	var commodity = data.data;
                    	var html = "<tr>";
                    		html += "<td>-</td>";
	                    	html += "<td>"+commodity["commodity_name"]+"</td>";
	                    	html += "<td><img  onclick=\"getPics('"+commodity['commodity_id']+"')\" style='height:150px' src='"+commodity["picture_address"]+"'></td>";
	                    	html += "<td>"+commodity["category_name"]+"</td>";
	                    	html += "<td>"+commodity["commodity_price"]+"</td>";
	                    	html += "<td>刚刚</td>";	    
	                    	html += "<td>-</td>";
                    	html+="</tr>";
                    	$("#commoditys").prepend(html);
                    	$('#add_commodity').modal('hide');
                    }else{
                    	alert(data.msg);
                    }
                }
            }); 
		}

		function addPicture(){
			var formData = new FormData(); 
			formData.append('file', $('#commodity_picture')[0].files[0]);
			$.ajax({
                url:"{:url('picturedo/addPicture')}",
                type:"post",
                data:formData,
                processData: false,                // jQuery不要去处理发送的数据
    			contentType: false,
    			dataType: 'json',
                success:function(data){
                    if (0 == data.code) {
                    	$('#img_picture').append("<li><img style='width:100px' src='"+data.data.picture_address+"'></li>");
                    	var values = $('#add_commodity input[name="pictures"]').val();
                    	values+=","+data.data.picture_id;
                    	$('#add_commodity input[name="pictures"]').val(values);
                    }else{
                    	alert(data.msg);
                    }
                }
            }); 
		}
	</script>
	<div id="add_commodity" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
			<h3 id="myModalLabel">发布商品</h3>
		</div>
		<form id="addCommodity" class="form-horizontal" onsubmit="return false;">
			<br>
			<input type="hidden" name="pictures">
			<div class="control-group">
	            <label class="control-label">商品名称</label>
	            <div class="controls">
	              <input type="text" name="commodity_name" placeholder="请输入商品名称" required><br>
	        	</div>
	        </div>
	        <div class="control-group">
	            <label class="control-label">商品价格</label>
	            <div class="controls">
	              <input type="number" name="commodity_price" min="0.00" step="0.01" required> 元<br>
	        	</div>
	        </div>
			<div class="control-group">
	            <label class="control-label">商品数量</label>
	            <div class="controls">
	              <input type="number" name="commodity_num" required><br>
	        	</div>
	        </div>
	        <div class="control-group">
	            <label class="control-label">商品类别</label>
	            <div class="controls">
	              <select name="category_id">
	              	{volist name='categorys' id='catrgory' }
						<option value="{$catrgory.category_id}">{$catrgory.category_name}</option>
	              	{/volist}
	              </select>
	        	</div>
	        </div>
			<div class="control-group">
	            <label class="control-label">商品地址</label>
	            <div class="controls">
	              <input type="text" name="commodity_addr" placeholder="请输入商品地址" required><br>
	        	</div>
	        </div>
	        <div class="control-group">
	            <label class="control-label">商品图片</label>
	            <div class="controls">
	              	<input type="file" id="commodity_picture" required onchange="addPicture()"><br>
	        	</div>
	        </div>
	        <div class="control-group">
	            <div class="controls">
	              	 <ul id="img_picture" >
	        	
	        		</ul>
	        	</div>
	        </div>
	       
		</form>
		<div class="modal-footer">
			<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
			<input class="btn" type="button" value="提交" onclick="addCommodity();">
		</div>
	</div>

	<div id="show_pic" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
			<h3 id="myModalLabel">商品图片</h3>
		</div>
	    <form class="form-horizontal">
	    	 <div class="control-group">
	            <div class="controls">
	              	 <ul id="Pics" >
	        		</ul>
	        	</div>
	        </div>
	    </form>
		<div class="modal-footer">
			<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
		</div>
	</div>
{/block}